<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>网易有道</title>
    <link rel="icon" href="./img/icon.png">
    <link rel="stylesheet" href="./css/cidian.css">
</head>
<body>
    <!-- 导航栏 -->
    <div class="topBar">
        <!-- 导航居中 -->
        <div class="top">
            <!-- 导航左部分 -->
            <div class="topleft">
                <a href="./cidian.html">词典</a>
                <a href="#">翻译</a>
                <a href="./../有道精品课/text.html">有道精品课</a>
                <a href="./../有道学习硬件/yd.html">有道学习硬件</a>
                <a href="./../网易云课堂/youdao.html">网易云课堂</a>
            </div>
            <!-- 导航右部分 -->
            <div class="topright">
                <div class="chanping">
                    <img src="img/全部.png">
                    <a href="#">全部产品</a>
                    <a href="#">登录</a>
                </div>  
            </div>
        </div>
    </div>
    <!-- 中间搜素 -->
    <div class="zhongjian">
        <img src="img/youdao.png">
        <div class="ssk">
            <div class="sskys">
                <div class="ssk1">
                    <div class="ssk1-1">英</div>
                    <div class="ssk1-2">中</div>
                </div>
                <div class="ssk2">
                     <div class="ssk2-1">
                        <input type="text" placeholder="在此输入单词或文本">
                     </div>
                </div>
                <img src="img/ssk.png" class="ssktp">
                <span>|</span>
                <img src="img/word_book_btn.f206077.png">
            </div>
        </div>
        <div class="chanpingdh">
            <ul>
                <li><a href="./../有道学习硬件/yd.html">
                    <img src="img/购买学习硬件.png" alt="">
                    <p>购买学习硬件</p>
                </a></li>
                <li><a href="./../有道精品课/text.html">
                    <img src="img/获取素养.png" alt="">
                    <p>获取素养课程</p>
                </a></li>
                <li><a href="./../网易云课堂/youdao.html">
                    <img src="img/开启职场.png" alt="">
                    <p>开启职场学习</p>
                </a></li>
                    
                <li><a href="./../网易云课堂/youdao.html">
                    <img src="img/报考.png" alt="">
                    <p>报名考研课程</p>
                </a></li>
                <li><a href="">
                    <img src="img/助力教育.png" alt="">
                    <p>助力教育信息化</p>
                </a></li>
            </ul>
        </div>
        <!-- 中间下部分 -->
        <div class="advbox">
            <div class="auto" auto-update="true">
                <div class="box" style="transform: translate3d(0px, 0px, 0px); transition-duration: 0ms;" aria-live="polite">
                    <div class="box1" role="group" aria-label="1/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-1">
                            <img src="img/网易app.png" alt="">
                            <div class="wz1-1">网易有道词典app</div>
                            <div class="wz1-2">智能学习更高效</div>
                        </div>
                    <div class="box1" role="group" aria-label="2/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-2">
                            <img src="img/有道词典笔.png" alt="">
                            <div class="wz2-1">有道词典笔</div>
                            <div class="wz2-2">更专业的词典笔</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="3/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-3">
                            <img src="img/有道纵横棋院.png" alt="">
                            <div class="wz3-1">有道纵横棋院</div>
                            <div class="wz3-2">AI围棋国象对弈平台</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="4/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-4">
                            <img src="img/网易有道翻译.png" alt="">
                            <div class="wz4-1">网易有道翻译</div>
                            <div class="wz4-2">史上最强大的桌面翻译软件</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="5/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-5">
                            <img src="img/有道智能护眼灯.png" alt="">
                            <div class="wz5-1">有道智能护眼灯</div>
                            <div class="wz5-2">专为孩子近视防控设计</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="6/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-6">
                            <img src="img/有道人工翻译.png" alt="">
                            <div class="wz6-1">有道人工翻译</div>
                            <div class="wz6-2">快速专业的人工翻译平台</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="7/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-7">
                            <img src="img/有道智能学习终端.png" alt="">
                            <div class="wz7-1">有道智能学习终端</div>
                            <div class="wz7-2">作业考试数据全场景采集</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="8/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-8">
                            <img src="img/网易云课堂.png" alt="">
                            <div class="wz4-1">网易云课堂</div>
                            <div class="wz4-2">在线实用技能学习平台</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="9/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-9">
                            <img src="img/有道听力宝.png" alt="">
                            <div class="wz4-1">有道听力宝</div>
                            <div class="wz4-2">英语听说练，进步看得见</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="10/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-10">
                            <img src="img/有道小图灵.png" alt="">
                            <div class="wz10-1">有道小图灵</div>
                            <div class="wz10-2">更系统的少儿编程教育</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="11/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-11">
                            <img src="img/中国大学MOOC.png" alt="">
                            <div class="wz11-1">中国大学MOOC</div>
                            <div class="wz11-2">中国知名高校MOOC课程</div>
                        </div>
                    </div>
                    <div class="box1" role="group" aria-label="12/12" style="width: 163.5px; margin-right: 22px;">
                        <div class="box1-12">
                            <img src="img/有道卡塔.png" alt="">
                            <div class="wz4-1">有道卡塔</div>
                            <div class="wz4-2">少儿AI素质教育平台</div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 左边按钮 -->
            <div class="left" tabindex="-1" role="button" aria-label="Previous slide" aria-controls="" aria-disabled="true">
                <img src="img/左.png" alt="">
            </div>
            <!-- 右边按钮 -->
            <div class="right" tabindex="0" role="button" aria-label="Next slide" aria-controls="" aria-disabled="false">
                <img src="img/右.png" alt="">
            </div>    
        </div>
    </div>
    <!-- 页尾 -->
    <footer class="di">
        <div class="footer">
            <div class="footer1">
                <div class="footer1-1">
                    <img src="./img/logo.png" class="logo">
                    <div class="tp">
                        <img src="./img/微信.png" class="channel-logo">
                        <img src="./img/微博.png" class="channel-logo">
                        <img src="./img/网易.png" class="channel-logo">
                        <img src="./img/1.png" class="channel-logo">
                    </div>
                </div>
                <div class="foot-content">
                    <ul>
                        <li>教育</li>
                        <li><a href="">有道智慧教育</a></li>
                        <li><a href="">中国大学MOOC</a></li>
                        <li><a href="">网易有道校企合作</a></li>
                    </ul>
                    <ul class="foot-list">
                        <li>关于有道</li>
                        <li> <a href="">有道介绍</a></li>
                        <li> <a href="">投资者关系</a></li>
                        <li><a href="">社会责任</a></li>
                        <li><a href="">同道计划</a></li>
                        <li><a href="">廉正举报</a></li>
                        <li><a href="">联系我们</a></li>
                    </ul>
                    <ul>
                        <li>加入有道</li>
                        <li><a href="">校园招聘</a></li>
                        <li><a href="">社会招聘</a></li>
                    </ul>
                    <ul>
                        <li>相关资质</li>
                        <li><a href="">营业执照</a></li>
                        <li><a href="">出版物经营许可证</a> </li>
                        <li><a href="">广播电视节目制作许可证</a></li>
                    </ul>
                    <ul>
                        <li>用户资质</li>
                        <li><a href="">隐私政策</a></li>
                        <li><a href="">服务条款</a></li>
                    </ul>
                    <ul>
                        <li>企业</li>
                        <li><a href="">有道智云 · AI 开放平台</a></li>
                        <li><a href="">有道智选</a></li>
                        <li><a href="">Youdao Ads</a></li>
                        <li><a href="">有道人工翻译</a></li>
                    </ul>
                </div>
            </div>
            <div class="copyright">
                <span>组别：</span>
                <span>贪生pass组</span>    
            </div>
            <div class="report">
                <div class="text">本页面组织者：
                    <span>章恒</span>&nbsp;
                </div>
                <div class="text">组员&nbsp;</div>
                <div class="text">张超&nbsp;杨席镔&nbsp;刘睿</div>
            </div>
        </div>
    </footer>
</body>
</html>